[ToC] [Up] [Back] [Next] ... [Book Plug] The Information Commons
.................... Introduction to HTML
On This Page: [ TR Alignment ] [ TD/TH Alignment ] [ TD and TH Override TR ]

4.10.3 The TR Element and Its Attributes

The TR Element defines a single table row. The TR element can take the attributes ALIGN and VALIGN, which define alignment properties for the contents of cells within that row. ALIGN, which defines the horizontal alignment properties, can take the values "left", "center" and "right", while VALIGN, which defines the vertical alignment properties of the cells, can take the possible values "top", "middle", "bottom". The default values are ALIGN="left", and VALIGN="middle".

TD and TH Alignment Attributes

The individual table cells, defined by the TD and TH elements, can also take the alignment attributes, to specify the alignment of the particular cell. This overrides the alignment specification given by TR, as shown in the examples below. The default values for TD cells are ALIGN="left", and VALIGN="middle", whle the default values for TH are ALIGN="center", and VALIGN="middle".

Table Alignment Attribute Examples

The following table, illustrating TR attributes:

<table border width=40%>
<TR>                 <TH> Head 1<BR>bloop </TH> <TH> Head 2 </TR>
<TR ALIGN="left">    <TH> Head 1<BR>bloop </TH> <TH> Head 2 </TR>
<TR VALIGN="bottom"> <TH> Head 1<BR>bloop </TH> <TH> Head 2 </TR>
<TR>                 <TH> Head 1<BR>bloop </TH> <TH> Head 2 </TR>
<TR ALIGN="center">  <TD> 4.11<BR>aaaa     </TD> <TD> 4.23   </TR>
<TR ALIGN="right">   <TD> 4.11<BR>aaaa     </TD> <TD> 4.23   </TR>
<TR VALIGN="top">    <TD> 4.11<BR>aaaa     </TD> <TD> 4.23   </TR>
<TR VALIGN="bottom"> <TD> 4.11<BR>aaaa     </TD> <TD> 4.23   </TR>
</table>

is displayed by your browser as: (I hope your browser supports tables!)

Head 1
bloop 		Head 2
Head 1
bloop 		Head 2
Head 1
bloop 		Head 2
Head 1
bloop 		Head 2
4.11
aaaa 		4.23
4.11
aaaa 		4.23
4.11
aaaa 		4.23
4.11
aaaa 		4.23

TD and TH Override TR

As the following example illustrates, alignment attributes on TD or TH attributes override those alignments specified by the TR

<table border width=40%>
<TR>                                 <TD>4.11<BR>aaaa</TD>  <TD> 4.23             </TR>
<TR ALIGN="center" VALIGN="center">  <TD>4.11<BR>aaaa</TD>  <TD> 4.23             </TR>
<TR ALIGN="center" VALIGN="center">  <TD>4.11<BR>aaaa</TD>  <TD VALIGN="top"> 4.23 </TR>
</table>

Is displayed as:

4.11
aaaa 		4.23
4.11
aaaa 		4.23
4.11
aaaa 		4.23
[ToC] [Up] [Back] [Next] ... [Book Plug] .................... Introduction to HTML
© Ian Graham 1994-1995 Page Last Updated: 4 December 1995